<style>
  .span_class {
    margin-left: 5px;
    font-weight: bolder;
    font-size: 16px
  }
</style>
<template>
  <div class="app-container">

      <el-form ref="form" :model="form" :rules="rules" label-width="150px">

        <el-row>
          <el-col :span="10">
            <el-form-item label="陪护豆兑换比例" prop="escortBeanExchangeScale">
              <el-input  v-model="form.escortBeanExchangeScale" class="config_input_class"  maxlength="3">
                <template slot="prepend">1元人民币可兑换为</template>
                <template slot="append">个陪护豆</template>
              </el-input>
            </el-form-item>
          </el-col>
<!--          <el-col :span="10">-->
<!--            <el-form-item label="签到距离" prop="signInDistance">-->
<!--              <el-input  v-model="form.signInDistance" class="config_input_class" oninput ="value=value.replace(/^(0+)|[^\d]+/g,'')" maxlength="2">-->
<!--                <template slot="prepend">距签到点距离</template>-->
<!--                <template slot="append">千米内即可签到</template>-->
<!--              </el-input>-->
<!--            </el-form-item>-->
<!--          </el-col>-->
          <el-col :span="10">
            <el-form-item label="陪护豆捐赠上限" prop="donateLimit">
              <el-input  v-model="form.donateLimit" class="config_input_class" oninput ="value=value.replace(/^(0+)|[^\d]+/g,'')" maxlength="4">
                <template slot="append">豆</template>
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="10">
            <el-form-item label="陪诊保证金" prop="escortSureMoney">
              <el-input  v-model="form.escortSureMoney" class="config_input_class" oninput ="value=value.replace(/^(0+)|[^\d]+/g,'')" maxlength="6">
                <template slot="append">元</template>
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="10">
            <el-form-item label="护工保证金" prop="careWorkerSureMoney">
              <el-input  v-model="form.careWorkerSureMoney" class="config_input_class" oninput ="value=value.replace(/^(0+)|[^\d]+/g,'')" maxlength="6">
                <template slot="append">元</template>
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="10">
            <el-form-item label="医生保证金" prop="doctorSureMoney">
              <el-input  v-model="form.doctorSureMoney" class="config_input_class" oninput ="value=value.replace(/^(0+)|[^\d]+/g,'')" maxlength="6">
                <template slot="append">元</template>
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="10">
            <el-form-item label="订单平台抽成比例" prop="orderCommissionScale">
              <el-input  v-model="form.orderCommissionScale" class="config_input_class" oninput ="value=value.replace(/^(0+)|[^\d]+/g,'')" maxlength="6">
                <template slot="append">%</template>
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="10">
            <el-form-item label="邀请一级分销比例" prop="firstDistributionScale">
              <el-input  v-model="form.firstDistributionScale" class="config_input_class" oninput ="value=value.replace(/^(0+)|[^\d]+/g,'')" maxlength="6">
                <template slot="append">%</template>
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="10">
            <el-form-item label="邀请二级分销比例" prop="secondDistributionScale">
              <el-input  v-model="form.secondDistributionScale" class="config_input_class" oninput ="value=value.replace(/^(0+)|[^\d]+/g,'')" maxlength="6">
                <template slot="append">%</template>
              </el-input>
            </el-form-item>
          </el-col>



        </el-row>

      </el-form>
      <div slot="footer" style="margin-top: 50px;margin-left: 700px">
        <el-button type="primary"  v-hasPermi="['system:sysconfig:submit']" style="width: 100px;" @click="submitForm">提 交</el-button>
      </div>

  </div>
</template>

<script>
import { saveSysConfig, getSysConfigInfo } from "@/api/system/config";
export default {
  name: "SysConfig",
  components: {
  },
  data() {
    return {
      // 遮罩层
      loading: true,
      // 选中数组
      ids: [],
      // 非单个禁用
      single: true,
      // 显示搜索条件
      showSearch: true,
      // 非多个禁用
      multiple: true,
      // 总条数
      total: 0,
      // 积分规则配置表格数据
      RuleList: [],
      // 弹出层标题
      title: "",
      // 是否显示弹出层
      open: false,
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
      },
      // 表单参数
      form: {},
      // 表单校验
      rules: {
        escortBeanExchangeScale: [
          { required: true, message: "陪护豆兑换比例不能为空", trigger: "blur" }
        ],
        signInDistance: [
          { required: true, message: "签到距离不能为空", trigger: "blur" }
        ],
        escortSureMoney: [
          { required: true, message: "陪诊保证金不能为空", trigger: "blur" }
        ],
        careWorkerSureMoney: [
          { required: true, message: "护工保证金不能为空", trigger: "blur" }
        ],
        doctorSureMoney: [
          { required: true, message: "医生保证金不能为空", trigger: "blur" }
        ],
        firstDistributionScale: [
          { required: true, message: "一级分销比例不能为空", trigger: "blur" }
        ],
        secondDistributionScale: [
          { required: true, message: "二级分销比例不能为空", trigger: "blur" }
        ],
        orderCommissionScale: [
          { required: true, message: "订单抽成比例不能为空", trigger: "blur" }
        ],
        donateLimit: [
          { required: true, message: "陪护豆捐赠上限不能为空", trigger: "blur" }
        ]
      }
    };
  },
  created() {
    this.handleUpdate()
  },
  methods: {
    // 表单重置
    reset() {
      this.form = {
        escortBeanExchangeScale: undefined,
        signInDistance: undefined,
        escortSureMoney: undefined,
        careWorkerSureMoney: undefined,
        doctorSureMoney: undefined,
        firstDistributionScale: undefined,
        secondDistributionScale: undefined,
        orderCommissionScale:undefined,
        donateLimit:undefined,
      };
      this.resetForm("form");
    },

    /** 修改按钮操作 */
    handleUpdate() {
      this.reset();
      getSysConfigInfo().then(response => {
        // 陪护豆兑换比例
        if (response.data.escortBeanExchangeScaleJson) {
          this.form.escortBeanExchangeScale = JSON.parse(response.data.escortBeanExchangeScaleJson).value
        }
        //签到距离
        if (response.data.signInDistanceJson) {
          this.form.signInDistance = JSON.parse(response.data.signInDistanceJson).value
        }
        //陪诊保证金
        if (response.data.escortSureMoneyJson) {
          this.form.escortSureMoney = JSON.parse(response.data.escortSureMoneyJson).value
        }
        //护工保证金
        if (response.data.careWorkerSureMoneyJson) {
          this.form.careWorkerSureMoney = JSON.parse(response.data.careWorkerSureMoneyJson).value
        }
        //医生保证金
        if (response.data.doctorSureMoneyJson) {
          this.form.doctorSureMoney = JSON.parse(response.data.doctorSureMoneyJson).value
        }
        //一级分销比例
        if (response.data.firstDistributionScaleJson) {
          this.form.firstDistributionScale = JSON.parse(response.data.firstDistributionScaleJson).value
        }
        //二级分销比例
        if (response.data.secondDistributionScaleJson) {
          this.form.secondDistributionScale = JSON.parse(response.data.secondDistributionScaleJson).value
        }
        //订单抽成比例
        if (response.data.orderCommissionScaleJson) {
          this.form.orderCommissionScale = JSON.parse(response.data.orderCommissionScaleJson).value
        }
        //陪护豆捐赠上限
        if (response.data.donateLimitJson) {
          this.form.donateLimit = JSON.parse(response.data.donateLimitJson).value
        }
      });
    },
    /** 提交按钮 */
    submitForm: function() {
      this.$refs["form"].validate(valid => {
        if (valid) {
          /* ###################### 组装数据 #################### */
          let data = {}
          // 陪护豆兑换比例
          let escortBeanExchangeScaleJson = {
            value: this.form.escortBeanExchangeScale,
            name: '陪护豆兑换比例',
            key: 'sys.escortBean.exchange.scale'
          }
          //签到距离
          let signInDistanceJson = {
            value: this.form.signInDistance,
            name: '签到距离',
            key: 'sys.sign.in.distance'
          }
          //陪诊保证金
          let escortSureMoneyJson = {
            value: this.form.escortSureMoney,
            name: '陪诊保证金',
            key: 'sys.escort.sure.money'
          }
          //护工保证金
          let careWorkerSureMoneyJson = {
            value: this.form.careWorkerSureMoney,
            name: '护工保证金',
            key: 'sys.careWorker.sure.money'
          }
          //医生保证金
          let doctorSureMoneyJson = {
            value: this.form.doctorSureMoney,
            name: '医生保证金',
            key: 'sys.doctor.sure.money'
          }
          //一级分销比例
          let firstDistributionScaleJson = {
            value: this.form.firstDistributionScale,
            name: '一级分销比例',
            key: 'sys.first.distribution.scale'
          }
          //医生保证金
          let secondDistributionScaleJson = {
            value: this.form.secondDistributionScale,
            name: '二级分销比例',
            key: 'sys.second.distribution.scale'
          }
          //订单抽成比例
          let orderCommissionScaleJson = {
            value: this.form.orderCommissionScale,
            name: '订单抽成比例',
            key: 'sys.order.commission.scale'
          }
          //陪护豆捐赠上限
          let donateLimitJson = {
            value: this.form.donateLimit,
            name: '陪护豆捐赠上限',
            key: 'sys.donate.limit'
          }
          data.escortBeanExchangeScaleJson = JSON.stringify(escortBeanExchangeScaleJson)
          data.signInDistanceJson = JSON.stringify(signInDistanceJson)
          data.escortSureMoneyJson = JSON.stringify(escortSureMoneyJson)
          data.careWorkerSureMoneyJson = JSON.stringify(careWorkerSureMoneyJson)
          data.doctorSureMoneyJson = JSON.stringify(doctorSureMoneyJson)
          data.firstDistributionScaleJson = JSON.stringify(firstDistributionScaleJson)
          data.secondDistributionScaleJson = JSON.stringify(secondDistributionScaleJson)
          data.orderCommissionScaleJson = JSON.stringify(orderCommissionScaleJson)
          data.donateLimitJson = JSON.stringify(donateLimitJson)
          if (data) {
            saveSysConfig(data).then(response => {
              this.$modal.msgSuccess('提交成功')
              this.handleUpdate()
            })

          }
        }
      });
    },
  }
};
</script>
